<style type="text/css">
	table img{
		cursor:pointer
	}
</style>

<div class="card">
	<div class="card-content">
		<div class = 'row row-head' >
			<div class = 'col s12'>
				<div class="btn-group left  margin-right-100" role="group" >
					
					<button class = 'btn btn-default btn-default-1' id = 'cancel'>  <i class="material-icons text-color4"  >clear</i> 取消</button>
					<button class = 'btn btn-default btn-default-1' id = 'flow' >  <i class="material-icons text-color3"  >repeat</i> 流程</button>
					
					<button class = 'btn btn-default btn-default-1' id = 'search'> <i class="material-icons text-color1"  >search</i> 搜索</button>
				</div>
				<div class = 'relative left'>
					<input type = 'text' id = 'search_table' class = 'width-400' placeholder = '表单内搜索' />
					<img src = '__PUBLIC__/image/search.png' class = 'absolute height18 input-hint' />
				</div>
			</div>

			
		</div>

		<div class = 'row row-body'>
			<div class = 'col s12'>
				<table class = 'dataTable centered table-small dataTable centered table-gray-header cell-border stripe' id = 'table'>
					<thead>
						<tr><th></th><th>标题</th><th>发起人</th><th>发起时间</th><th>类型</th><th>当前处理人</th><th>处理状态</th><th>流程日志</th></tr>
					</thead>
					<tbody id = 'tbody'>
						{$tbody|raw}
					</tbody>
				</table>
			</div>
		</div>
		
		
		
		{include file='public/page/page' /}
	
		


		
					
	</div>
</div>
<style type="text/css">
	
</style>

<script>

	

	var app = {
		
		table : {},

		parameterO: {},

		searchOption : {},

		data : {},

		ini : function(){

			app.table = d_table();

			$('#check').click(function(){
				if($('#tbody tr.selected').length == 0) return false;
				app.check()
			});
		
			$('#flow').click(function(){

				if($('#tbody tr.selected').length == 0) return false;

				parent.layer.open({
					title:'<span style = "font-size:12px">流程查看</span>',
					type: 2,
					shadeClose:true,
					offset:'0',
					area: ['90%','100%'],
					content: "__APP__/Fs/see?flowid="+app.parameterO.flowid,
					isOutAnim: false,
				});
			});

			$('#cancel').click(function(){
				if($('#tbody tr.selected').length == 0) return false;
				parent.layer.confirm('确定取消？',
                {
                    btn: ['确定', '取消'],
                    title:'确认框',
                    area: ['260px','151px'],
                    offset:'20%',
                    isOutAnim: false ,
                    'yes':function(index, layero){
                        let index2 = layer.load(2);
						
                        $.post('__APP__/Fs/cancel',app.parameterO,function(d){
                            layer.close(index2);
                            if(d.status == 's'){
                                app.table.row($('#tbody tr.selected').eq(0)).remove().draw();
                                parent.layer.msg('取消成功',{icon:1,time:1000,offset:'30%'});
                              
 
                            }else{
                                layer.msg(d.info,{icon:2,time:2000,offset:'30%'});
                                parent.layer.close(index); //再执行关闭
                            }
                        });
                    }
                });    

			});


			$('#tbody').click(function(e){

				let flow_id,node_id,id;

				if(e.target.nodeName.toUpperCase() == 'TR'){
					flow_id = $(e.target).data('flow_id');
					node_id = $(e.target).data('node_id');
					id = $(e.target).data('id');
				}else{
					
					flow_id = $(e.target).parents('tr').data('flow_id');
					node_id = $(e.target).parents('tr').data('node_id');
					id = $(e.target).parents('tr').data('id');

				}
				app.parameterO.flowid = flow_id;
				app.parameterO.nodeid = node_id;
				app.parameterO.id = id;
			
				if(e.target.nodeName == 'A'){
					parent.layer.open({
						skin: 'layer-edit-container',
						title:'<span style = "font-size:12px">流程处理</span>',
						type: 2 ,
						shadeClose:true ,
						offset:'0' ,
						area: [ '1200px' , '100%' ],
						content: '__APP__/Fs/flow2?type=0&flow_id='+flow_id+'&node_id='+node_id+'&id='+id,
						isOutAnim: false,
						success : function(layero, index){
							top.tmp2 = layero.find('iframe')[0]['name'];
							
						},
					});
				}else if($(e.target).hasClass('rizhi')){
					let flow_id = $(e.target).data('flow_id');
					top.layer.open({
						title:'<span style = "font-size:12px">流程日志</span>',
						area: ['800px','100%'],
						offset:'1px',
						shadeClose:true,
						isOutAnim: false ,
						maxmin: true,
						type: 2, 
						content:'__APP__/Fs/flow_log?flow_id='+flow_id
					});
				}
			});

			//$('#tbody a').eq(0).trigger('click');

			$('#search_table').keypress(function(e){
				let text = $.trim($(this).val());
				if(e.keyCode == 13){
					table.search(text).draw();
				}
			});

			page('__APP__/Fs/research',app.table,$.extend({type:2},app.searchOption));

			$('#search').click(function(){
				let div2 = [
					{ 'name' : '发起者编号：' ,'id' : 'username' ,'type' : 'text'},
					{ 'name' : '发起者姓名：' ,'id' : 'maker_name' ,'type' : 'text'},
					{ 'name' : '标题：' ,'id' : 'title' ,'type' : 'text'},
				];
				parent.layer.open({
					skin: 'layer-search-container',
					title : '搜索用户',
					offset : ['40px'],
					area  : ['600px',"300px"],
					type  : 1,
					btn   : ['搜索','清除'],
					shadeClose:true,
					isOutAnim: false,
					content : create_new_div( div2 ),
					success : function(){
						for(let s of div2){
							$('#' + s.id).val( app.searchOption[s.id] );
						}
					},
					btn2 : function(){
						for(let s of div2){
							$('#' + s.id).val('');
						}
						return false;
					},
					yes : function(index){
						let o = get_page();
						let hasOption = false;
						for(let s of div2){
							o[s.id] = $('#' + s.id).val();
							app.searchOption[s.id] = $('#' + s.id).val();
							if(app.searchOption[s.id] != '') hasOption = true;
						}
						o.type = 1;
						if(hasOption){
							$('#search').addClass('has-option');
						}else{
							$('#search').removeClass('has-option');
						}
						page_callback(o,'__APP__/Fs/research',app.table);
						parent.layer.close(index);
					}
				});
			});

			//$('#tbody a').eq(0).trigger('click');
		},	

	}
	app.ini();
</script>



